import { useEffect, useState } from "react";

export function useFetch(uri) {
  const [data, setData] = useState();
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState();

  useEffect(() => {
    if (!uri) return;
    setLoading(true);
    fetch(uri)
      .then((res) => {
        if (!res.ok) {
          // console.log(1111, res);
          setLoading(false);
          const { status, url } = res;
          return { status, url };
        }
        return res.json();
      })
      .then((res) => {
        // console.log("2222", res);
        setData(res);
      })
      .then(() => setLoading(false))
      .catch((err) => {
        setLoading(false);
        setError(err);
      });
  }, [uri]);

  return { data, loading, error };
}
